<template>
	<!-- <el-dialog v-model="props.dialogVisible" :title="props.name" style="width: 90%;height:1200px;"> -->
		<div id="main" style="width: 1000px;height:1000px;">
		</div>
		<!-- <template #footer>
			<span class="dialog-footer">
				<el-button @click="props.dialogVisible = false">取消</el-button>
				<el-button type="primary" @click="props.dialogVisible = false">
					确认
				</el-button>
			</span>
		</template>
	</el-dialog> -->
</template>

<script setup>
import * as echarts from 'echarts';
import { onMounted, ref, computed } from 'vue'
var myChart
// const dialogVisible = computed(() => {
// 	console.log(props.dialogVisible);
// 	if(props.dialogVisible)
// 	setTimeout(() => {
//         echartsInit()
//       }, 100)
//   return props.dialogVisible
// })
const props = defineProps(['name', 'data', 'dialogVisible'])
onMounted(() => {
	setTimeout(() => {
        echartsInit()
      }, 100)
})
// watch(() => props.dialogVisible.value, (new)=>{dialogVisible.value=new})
// watchEffect(() => {
// 	dialogVisible.value = props.dialogVisible;
// })
// const computedIsCollapse = computed(() => props.isCollapse)
const echartsInit = () => {
	let data = props.data == undefined ? data1 : props.data
	console.log(typeof data);
	myChart = echarts.init(document.getElementById('main'));
	data[0].children.forEach(function (datum, index) {
    index % 2 === 0 && (datum.collapsed = true);
  });
	myChart.setOption({
      tooltip: {
        trigger: 'item',
        triggerOn: 'mousemove'
      },
      series: [
        {
          type: 'tree',
          data: data,
          top: '1%',
          left: '7%',
        //   bottom: '20%',
        //   right: '20%',
          symbolSize: 7,
          label: {
            position: 'left',
            verticalAlign: 'middle',
            align: 'right',
            fontSize: 14
          },
          leaves: {
            label: {
              position: 'right',
              verticalAlign: 'middle',
              align: 'left'
            }
          },
          emphasis: {
            focus: 'descendant'
          },
        //   expandAndCollapse: true,
        //   animationDuration: 550,
        //   animationDurationUpdate: 750
        }
      ]
    }
  );
}
const print = ()=>{console.log(233);}

defineExpose({echartsInit, print})

const data1 = [
    {
        "name": "\u798f\u5efa\u6cd5\u4eba",
        "children": [
            {
                "name": "\u4f01\u4e1a\u57fa\u672c\u4fe1\u606f",
                "children": [
                    {
                        "name": "\u7ecf\u8425\u573a\u6240"
                    },
                    {
                        "name": "\u4f01\u4e1a\u6570\u5b57\u8bc1\u4e66"
                    },
                    {
                        "name": "\u7ec4\u7ec7\u673a\u6784\u4ee3\u7801"
                    },
                    {
                        "name": "\u5de5\u5546\u6ce8\u518c\u53f7"
                    },
                    {
                        "name": "\u6cd5\u5b9a\u4ee3\u8868\u4eba\u8bc1\u4ef6\u53f7\u7801"
                    },
                    {
                        "name": "\u7ecf\u8425\u5f00\u59cb\u65e5\u671f"
                    },
                    {
                        "name": "\u6cd5\u5b9a\u4ee3\u8868\u4eba\u59d3\u540d"
                    },
                    {
                        "name": "\u884c\u653f\u533a\u5212"
                    },
                    {
                        "name": "\u7ecf\u8425\u8303\u56f4"
                    },
                    {
                        "name": "\u767b\u8bb0\u673a\u5173"
                    },
                    {
                        "name": "\u6cd5\u5b9a\u4ee3\u8868\u4eba\u8bc1\u4ef6\u4ee3\u7801"
                    },
                    {
                        "name": "\u4f01\u4e1a\u8bc6\u522b\u4fe1\u606f"
                    },
                    {
                        "name": "None"
                    },
                    {
                        "name": "\u884c\u4e1a\u5206\u7c7b\u7f16\u7801"
                    },
                    {
                        "name": "\u7ecf\u8425\u622a\u6b62\u65e5\u671f"
                    },
                    {
                        "name": "\u4f01\u4e1a\u7c7b\u578b"
                    },
                    {
                        "name": "\u6210\u7acb\u65e5\u671f"
                    },
                    {
                        "name": "\u6ce8\u518c\u8d44\u672c"
                    }
                ]
            },
            {
                "name": "\u4f01\u4e1a\u884c\u653f\u8bb8\u53ef\u4fe1\u606f",
                "children": [
                    {
                        "name": "\u53d1\u8bc1\u673a\u5173"
                    },
                    {
                        "name": "\u53d1\u8bc1\u65e5\u671f"
                    },
                    {
                        "name": "\u8bb8\u53ef\u6587\u4ef6\u540d\u79f0"
                    },
                    {
                        "name": "\u4f01\u4e1a\u8bc6\u522b\u4fe1\u606f"
                    },
                    {
                        "name": "\u8bb8\u53ef\u7c7b\u578b"
                    },
                    {
                        "name": "\u8bb8\u53ef\u6587\u4ef6\u7f16\u53f7"
                    },
                    {
                        "name": "\u8bb8\u53ef\u4e8b\u9879"
                    },
                    {
                        "name": "\u6709\u6548\u671f\u81f3"
                    }
                ]
            },
            {
                "name": "\u4f01\u4e1a\u8d44\u8d28\u4fe1\u606f",
                "children": [
                    {
                        "name": "\u8d44\u8d28\u4e1a\u52a1\u5185\u5bb9"
                    },
                    {
                        "name": "\u53d1\u8bc1\u673a\u5173"
                    },
                    {
                        "name": "\u53d1\u8bc1\u65e5\u671f"
                    },
                    {
                        "name": "\u8d44\u8d28\u7b49\u7ea7\u4e00"
                    },
                    {
                        "name": "\u8d44\u8d28\u8bc1\u4ef6\u7f16\u53f7"
                    },
                    {
                        "name": "\u6709\u6548\u671f\u81f3"
                    },
                    {
                        "name": "\u4f01\u4e1a\u8bc6\u522b\u4fe1\u606f"
                    },
                    {
                        "name": "\u8d44\u8d28\u540d\u79f0"
                    },
                    {
                        "name": "\u8d44\u8d28\u7b49\u7ea7\u4e8c"
                    }
                ]
            },
            {
                "name": "\u4f01\u4e1a\u8ba4\u5b9a\u4fe1\u606f",
                "children": [
                    {
                        "name": "\u4f01\u4e1a\u8ba4\u5b9a\u540d\u79f0"
                    },
                    {
                        "name": "\u4f01\u4e1a\u8bc6\u522b\u4fe1\u606f"
                    },
                    {
                        "name": "\u8ba4\u5b9a\u65e5\u671f"
                    },
                    {
                        "name": "\u8ba4\u5b9a\u673a\u5173"
                    },
                    {
                        "name": "\u6709\u6548\u671f\u81f3"
                    }
                ]
            },
            {
                "name": "\u4f01\u4e1a\u7ecf\u8425\u6d3b\u52a8\u4fe1\u606f",
                "children": [
                    {
                        "name": "\u91d1\u989d"
                    },
                    {
                        "name": "\u65e5\u671f"
                    },
                    {
                        "name": "\u9879\u76ee\u7c7b\u578b"
                    },
                    {
                        "name": "\u4f01\u4e1a\u8bc6\u522b\u4fe1\u606f"
                    },
                    {
                        "name": "\u4ea4\u6613\u7c7b\u578b"
                    },
                    {
                        "name": "\u7ecf\u8425\u6d3b\u52a8\u540d\u79f0"
                    }
                ]
            },
            {
                "name": "\u4f01\u4e1a\u5bf9\u5916\u4ea4\u6d41\u4fe1\u606f",
                "children": [
                    {
                        "name": "\u4ea4\u6d41\u65e5\u671f"
                    },
                    {
                        "name": "\u4ea4\u6d41\u5730\u70b9"
                    },
                    {
                        "name": "\u4f01\u4e1a\u8bc6\u522b\u4fe1\u606f"
                    },
                    {
                        "name": "\u6d3b\u52a8\u540d\u79f0"
                    },
                    {
                        "name": "\u4ea4\u6d41\u7c7b\u578b"
                    }
                ]
            },
            {
                "name": "\u4f01\u4e1a\u6295\u8d44\u4fe1\u606f",
                "children": [
                    {
                        "name": "\u6295\u8d44\u65f6\u95f4"
                    },
                    {
                        "name": "\u6295\u8d44\u7c7b\u578b"
                    },
                    {
                        "name": "\u4f01\u4e1a\u8bc6\u522b\u4fe1\u606f"
                    },
                    {
                        "name": "\u6295\u8d44\u91d1\u989d"
                    },
                    {
                        "name": "\u6295\u8d44\u9879\u76ee\u540d\u79f0"
                    },
                    {
                        "name": "\u80a1\u4efd\u5360\u6bd4"
                    },
                    {
                        "name": "\u6295\u8d44\u5bf9\u8c61"
                    }
                ]
            },
            {
                "name": "\u4f01\u4e1a\u653f\u5e9c\u9879\u76ee\u4fe1\u606f",
                "children": [
                    {
                        "name": "\u9879\u76ee\u540d\u79f0"
                    },
                    {
                        "name": "\u8d44\u52a9\u6027\u8d28"
                    },
                    {
                        "name": "\u9879\u76ee\u7c7b\u578b"
                    },
                    {
                        "name": "\u4f01\u4e1a\u8bc6\u522b\u4fe1\u606f"
                    },
                    {
                        "name": "\u8d44\u52a9\u91d1\u989d"
                    },
                    {
                        "name": "\u9879\u76ee\u7acb\u9879\u65f6\u95f4"
                    },
                    {
                        "name": "\u8d44\u52a9\u5355\u4f4d"
                    }
                ]
            },
            {
                "name": "\u4f01\u4e1a\u62bd\u67e5\u68c0\u67e5\u4fe1\u606f",
                "children": [
                    {
                        "name": "\u62bd\u67e5\u68c0\u67e5\u65e5\u671f"
                    },
                    {
                        "name": "\u62bd\u67e5\u68c0\u67e5\u5b9e\u65bd\u673a\u5173"
                    },
                    {
                        "name": "\u62bd\u67e5\u68c0\u67e5\u7c7b\u578b"
                    },
                    {
                        "name": "\u4f01\u4e1a\u8bc6\u522b\u4fe1\u606f"
                    },
                    {
                        "name": "\u62bd\u67e5\u68c0\u67e5\u4e8b\u9879\u540d\u79f0"
                    },
                    {
                        "name": "\u62bd\u67e5\u68c0\u67e5\u7ed3\u679c"
                    }
                ]
            },
            {
                "name": "\u4f01\u4e1a\u5e74\u5ea6\u62a5\u544a\u4fe1\u606f",
                "children": [
                    {
                        "name": "\u4f01\u4e1a\u8bc6\u522b\u4fe1\u606f"
                    },
                    {
                        "name": "\u5e74\u5ea6\u62a5\u544a\u5185\u5bb9"
                    },
                    {
                        "name": "\u63d0\u4ea4\u62a5\u544a\u5e74\u5ea6"
                    },
                    {
                        "name": "\u5e74\u5ea6\u62a5\u544a\u6587\u4ef6\u7c7b\u578b"
                    }
                ]
            },
            {
                "name": "\u4f01\u4e1a\u7a0e\u52a1\u767b\u8bb0\u4fe1\u606f",
                "children": [
                    {
                        "name": "\u4f01\u4e1a\u8bc6\u522b\u4fe1\u606f"
                    },
                    {
                        "name": "\u767b\u8bb0\u7a0e\u52a1\u7c7b\u578b"
                    },
                    {
                        "name": "\u7a0e\u52a1\u767b\u8bb0\u65e5\u671f"
                    },
                    {
                        "name": "\u7a0e\u52a1\u767b\u8bb0\u673a\u5173"
                    }
                ]
            },
            {
                "name": "\u4f01\u4e1a\u7a0e\u6536\u7f34\u7eb3\u4fe1\u606f",
                "children": [
                    {
                        "name": "\u7eb3\u7a0e\u91d1\u989d"
                    },
                    {
                        "name": "\u7eb3\u7a0e\u65e5\u671f"
                    },
                    {
                        "name": "\u4f01\u4e1a\u8bc6\u522b\u4fe1\u606f"
                    },
                    {
                        "name": "\u7eb3\u7a0e\u7c7b\u578b"
                    },
                    {
                        "name": "\u6536\u7f34\u5355\u4f4d"
                    }
                ]
            },
            {
                "name": "\u4f01\u4e1a\u8d22\u52a1\u72b6\u51b5\u4fe1\u606f",
                "children": [
                    {
                        "name": "\u4f01\u4e1a\u8bc6\u522b\u4fe1\u606f"
                    },
                    {
                        "name": "\u4f01\u4e1a\u8d22\u52a1\u62a5\u8868\u6587\u4ef6\u7c7b\u578b"
                    },
                    {
                        "name": "\u4f01\u4e1a\u8d22\u52a1\u62a5\u8868"
                    },
                    {
                        "name": "\u62a5\u8868\u5e74\u4efd"
                    }
                ]
            },
            {
                "name": "\u4f01\u4e1a\u878d\u8d44\u60c5\u51b5\u4fe1\u606f",
                "children": [
                    {
                        "name": "\u878d\u8d44\u65b9\u5f0f"
                    },
                    {
                        "name": "\u878d\u8d44\u5bf9\u8c61\u8bc6\u522b\u4fe1\u606f"
                    },
                    {
                        "name": "\u878d\u8d44\u5bf9\u8c61\u7c7b\u522b"
                    },
                    {
                        "name": "\u4f01\u4e1a\u8bc6\u522b\u4fe1\u606f"
                    },
                    {
                        "name": "\u878d\u8d44\u65f6\u95f4"
                    },
                    {
                        "name": "\u878d\u8d44\u91d1\u989d"
                    },
                    {
                        "name": "\u80a1\u4efd\u5360\u6bd4"
                    }
                ]
            },
            {
                "name": "\u4f01\u4e1a\u4fe1\u8d37\u60c5\u51b5\u4fe1\u606f",
                "children": [
                    {
                        "name": "\u4fe1\u8d37\u91d1\u989d"
                    },
                    {
                        "name": "\u4fe1\u8d37\u65f6\u95f4"
                    },
                    {
                        "name": "\u4f01\u4e1a\u8bc6\u522b\u4fe1\u606f"
                    },
                    {
                        "name": "\u4fe1\u8d37\u65f6\u957f"
                    },
                    {
                        "name": "\u4fe1\u8d37\u673a\u6784"
                    }
                ]
            },
            {
                "name": "\u4f01\u4e1a\u516c\u8bc1\u4fe1\u606f",
                "children": [
                    {
                        "name": "\u51fa\u8bc1\u65e5\u671f"
                    },
                    {
                        "name": "\u516c\u8bc1\u4e66\u6587\u53f7"
                    },
                    {
                        "name": "\u516c\u8bc1\u5730\u70b9"
                    },
                    {
                        "name": "\u4f01\u4e1a\u8bc6\u522b\u4fe1\u606f"
                    },
                    {
                        "name": "\u516c\u8bc1\u4e66\u7b7e\u53d1\u673a\u6784"
                    }
                ]
            },
            {
                "name": "\u4f01\u4e1a\u53f8\u6cd5\u6848\u4ef6\u4fe1\u606f",
                "children": [
                    {
                        "name": "\u6848\u4ef6\u65e5\u671f"
                    },
                    {
                        "name": "\u6848\u4ef6\u6587\u4e66\u53f7"
                    },
                    {
                        "name": "\u5ba1\u7406\u673a\u6784"
                    },
                    {
                        "name": "\u4f01\u4e1a\u8bc6\u522b\u4fe1\u606f"
                    },
                    {
                        "name": "\u6848\u4ef6\u540d\u79f0"
                    },
                    {
                        "name": "\u6848\u4ef6\u7c7b\u578b"
                    }
                ]
            },
            {
                "name": "\u4f01\u4e1a\u77e5\u8bc6\u4ea7\u6743",
                "children": [
                    {
                        "name": "\u77e5\u8bc6\u4ea7\u6743\u53f7\u7801"
                    },
                    {
                        "name": "\u77e5\u8bc6\u4ea7\u6743\u7c7b\u578b"
                    },
                    {
                        "name": "\u4f01\u4e1a\u8bc6\u522b\u4fe1\u606f"
                    },
                    {
                        "name": "\u6388\u6743\uff08\u51fa\u7248\uff09\u65e5\u671f"
                    },
                    {
                        "name": "\u7533\u8bf7\u65e5\u671f"
                    },
                    {
                        "name": "\u77e5\u8bc6\u4ea7\u6743\u540d\u79f0"
                    }
                ]
            },
            {
                "name": "\u4f01\u4e1a\u804c\u5de5\u4fe1\u606f",
                "children": [
                    {
                        "name": "\u8bc1\u4ef6\u4ee3\u7801"
                    },
                    {
                        "name": "\u804c\u52a1"
                    },
                    {
                        "name": "\u662f\u5426\u9ad8\u7ba1"
                    },
                    {
                        "name": "\u62a4\u7167\u53f7"
                    },
                    {
                        "name": "\u4f01\u4e1a\u8bc6\u522b\u4fe1\u606f"
                    },
                    {
                        "name": "\u804c\u5de5\u59d3\u540d"
                    },
                    {
                        "name": "\u8eab\u4efd\u8bc1\u53f7"
                    },
                    {
                        "name": "\u5165\u804c\u65f6\u95f4"
                    }
                ]
            },
            {
                "name": "\u4f01\u4e1a\u4fdd\u9669\u7f34\u7eb3\u4fe1\u606f",
                "children": [
                    {
                        "name": "\u7f34\u8d39\u65f6\u95f4"
                    },
                    {
                        "name": "\u6536\u7f34\u673a\u5173"
                    },
                    {
                        "name": "\u62a4\u7167\u53f7"
                    },
                    {
                        "name": "\u4fdd\u9669\u7c7b\u578b"
                    },
                    {
                        "name": "\u4f01\u4e1a\u8bc6\u522b\u4fe1\u606f"
                    },
                    {
                        "name": "\u804c\u5de5\u59d3\u540d"
                    },
                    {
                        "name": "\u7f34\u8d39\u91d1\u989d"
                    },
                    {
                        "name": "\u8eab\u4efd\u8bc1\u53f7"
                    }
                ]
            },
            {
                "name": "\u4f01\u4e1a\u5de5\u4f1a\u6d3b\u52a8\u4fe1\u606f",
                "children": [
                    {
                        "name": "\u652f\u6301\u91d1\u989d"
                    },
                    {
                        "name": "\u4f01\u4e1a\u8bc6\u522b\u4fe1\u606f"
                    },
                    {
                        "name": "\u6d3b\u52a8\u540d\u79f0"
                    },
                    {
                        "name": "\u6d3b\u52a8\u65f6\u95f4"
                    }
                ]
            },
            {
                "name": "\u4f01\u4e1a\u5956\u52b1\u4fe1\u606f",
                "children": [
                    {
                        "name": "\u9881\u53d1\u673a\u6784"
                    },
                    {
                        "name": "\u83b7\u5956\u65f6\u95f4"
                    },
                    {
                        "name": "\u5956\u52b1\u540d\u79f0"
                    },
                    {
                        "name": "\u4f01\u4e1a\u8bc6\u522b\u4fe1\u606f"
                    },
                    {
                        "name": "\u83b7\u5956\u7ea7\u522b"
                    }
                ]
            },
            {
                "name": "\u4f01\u4e1a\u5931\u4fe1\u4fe1\u606f",
                "children": [
                    {
                        "name": "\u8bb0\u5f55\u65f6\u95f4"
                    },
                    {
                        "name": "\u5931\u4fe1\u540d\u79f0"
                    },
                    {
                        "name": "\u4f01\u4e1a\u8bc6\u522b\u4fe1\u606f"
                    },
                    {
                        "name": "\u5931\u4fe1\u7c7b\u578b"
                    },
                    {
                        "name": "\u5217\u5165\u673a\u5173"
                    }
                ]
            },
            {
                "name": "\u4f01\u4e1a\u64a4\u8d44\u4fe1\u606f",
                "children": [
                    {
                        "name": "\u64a4\u8d44\u4eba\u8bc6\u522b\u4fe1\u606f \uff08\u7edf\u4e00\u793e\u4f1a\u4fe1\u7528\u4ee3\u7801\uff09"
                    },
                    {
                        "name": "\u64a4\u8d44\u4eba\u8bc6\u522b\u4fe1\u606f\uff08\u6cd5\u4eba\u540d\u79f0\uff09"
                    },
                    {
                        "name": "\u64a4\u8d44\u91d1\u989d"
                    },
                    {
                        "name": "\u64a4\u8d44\u4eba\u8bc6\u522b\u4fe1\u606f\uff08\u59d3\u540d\uff09"
                    },
                    {
                        "name": "\u64a4\u8d44\u65f6\u95f4"
                    },
                    {
                        "name": "\u64a4\u8d44\u539f\u56e0"
                    },
                    {
                        "name": "\u4f01\u4e1a\u8bc6\u522b\u4fe1\u606f"
                    },
                    {
                        "name": "\u64a4\u8d44\u4eba\u8bc6\u522b\u4fe1\u606f\uff08\u8eab\u4efd\u8bc1\u53f7\uff09"
                    },
                    {
                        "name": "\u64a4\u8d44\u4eba\u7c7b\u578b"
                    },
                    {
                        "name": "\u64a4\u8d44\u4eba\u8bc6\u522b\u4fe1\u606f\uff08\u62a4\u7167\u53f7\uff09"
                    }
                ]
            },
            {
                "name": "\u4f01\u4e1a\u6ce8\u9500\u4fe1\u606f",
                "children": [
                    {
                        "name": "\u4f01\u4e1a\u8bc6\u522b\u4fe1\u606f"
                    },
                    {
                        "name": "\u6ce8\u9500\u65e5\u671f"
                    },
                    {
                        "name": "\u6ce8\u9500\u539f\u56e0"
                    }
                ]
            }
        ]
    }
]
</script>
